<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>对账单详情</title>
	<!-- 引入样式 -->
	<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
	<!-- 引入组件库 -->
	<script src="https://unpkg.com/vue/dist/vue.js"></script>
	<script src="https://unpkg.com/element-ui/lib/index.js"></script>
	<link rel="stylesheet" type="text/css" href="./css/countDetail.css">
</head>

<body>
	<div id="app" v-cloak v-if="countDetail">
		<h1 class="titles">对账单详情</h1>
		<div class="countDetail">
			<div class="step">
				<el-steps :active="status" finish-status="success">
					<el-step title="待确定"></el-step>
					<el-step title="已确定"></el-step>
					<el-step title="已开票"></el-step>
					<el-step title="待结算"></el-step>
					<el-step title="已结算"></el-step>
				</el-steps>
			</div>
			<div class="countMess">
				<div class="countDetailMess">
					<p><span>对账单号</span><label>{{countDetail.CONFIRMNO}}</label></p>
					<p><span>来源平台</span><label>{{countDetail.COMPNAME}}</label></p>
					<p><span>创建日期</span><label>{{countDetail.CREATETIME | filterTimes}}</label></p>
					<p><span>订单合计金额</span><label>￥{{sum1}}</label></p>
					<p><span>订单实付金额</span><label>￥{{sum2}}</label></p>
					<p><span>平台补贴</span><label>￥{{sum3}}</label></p>
					<p><span>商家补贴</span><label>￥{{sum4}}</label></p>
					<p><span>商家结算汇率</span><label>{{countDetail.RATIO|percentage}}</label></p>
					<p><span>结算金额</span><label>￥{{sum5}}</label></p>
					<p><span>结算状态</span><label>{{countDetail.BILLSTATUS | filterTypes}}</label></p>
					<p>
						<span>确认时间</span>
						<label v-if="countDetail.CONFIRMDATE">{{countDetail.CONFIRMDATE | filterTimes1}}&nbsp;&nbsp;(对方确定时间)</label>
						<label v-else>--&nbsp;&nbsp;(对方确定时间)</label>
					</p>
					<p><span>开票时间</span><label><el-date-picker
							v-model.trim="tickTime"
							type="date" placeholder="发票的开票时间"> （发票开出时间）</label></p>
					<!-- <p v-if="countDetail.BILLSTATUS==4"><span>结算时间</span><label><el-date-picker
							v-model.trim="settleTime"
							type="date" placeholder="结算时选择时间"> 财务结算时间</label></p> -->
					<p><span>发票号码</span>
						<el-input v-model.trim="ticketNumber" placeholder="发票号码"></el-input><label>(发票号码)</label></p>
					<p class="remark"><span>结算备注:</span><textarea v-model.trim="settleRemark"></textarea></p>
				</div>
				<div class="countMessItem">
					<h2>结算订单(共{{countDetail.ORDERARR.length}}单)</h2>
					<el-table :data="countDetail.ORDERARR" :border="true" :highlight-current-row="true" style="width:100%;text-align:center;cursor:pointer;">
						<el-table-column prop="ORDERNO" label="订单号码">
							<template slot-scope="scope">
		                        <span style="color:blue;">{{scope.row.ORDERNO}}</span>
		                    </template>
						</el-table-column>
						<el-table-column prop="CREATETIME" label="下单日期">
							<template slot-scope="scope">
		                        <span>{{scope.row.CREATETIME | filterTimes}}</span>
		                    </template>
						</el-table-column>
						<el-table-column prop="TOTALFEE" label="订单金额">
							<template slot-scope="scope">
		                        <span v-if="scope.row.TOTALFEE||scope.row.TOTALFEE==0">￥{{scope.row.TOTALFEE}}</span>
								<span v-else>--</span>
		                    </template>
						</el-table-column>
						<el-table-column prop="PAYFEE" label="实付金额">
							<template slot-scope="scope">
		                        <span v-if="scope.row.PAYFEE||scope.row.PAYFEE==0">￥{{scope.row.PAYFEE}}</span>
								<span v-else>--</span>
		                    </template>
						</el-table-column>
						<el-table-column prop="CARNTDISCOUNT" label="平台补贴" width='80'>
							<template slot-scope="scope">
		                        <span v-if="scope.row.CARNTDISCOUNT||scope.row.CARNTDISCOUNT==0">￥{{scope.row.CARNTDISCOUNT}}</span>
								<span v-else>--</span>
		                    </template>
						</el-table-column>
						<el-table-column prop="PLATFORMDISCOUNT" label="商家补贴" width='80'>
							<template slot-scope="scope">
		                        <span v-if="scope.row.PLATFORMDISCOUNT||scope.row.PLATFORMDISCOUNT==0">￥{{scope.row.PLATFORMDISCOUNT}}</span>
								<span v-else>--</span>
		                    </template>
						</el-table-column>
					</el-table>
				</div>
			</div>
		</div>
		<div class="allBtns" style="position:relative;">
			<el-button @click.native="eidtRemark">保存备注</el-button>
			<el-button v-if="countDetail.BILLSTATUS <= 2" @click.native="comfirmTick">已收票确认</el-button>
			<el-button type="danger" @click.native="cacleOrder">撤销对账单</el-button>
			<el-button @click.native="excel" style="position:absolute;top:0;right:100px;">导出</el-button>
		</div>
	</div>
	<script src="https://cdn.jsdelivr.net/npm/vue-resource@1.3.5"></script>
	<script type="text/javascript" src="./js/countDetail.js"></script>
</body>

</html>
